<template>
  <div class="main">
    <div class="search">
      <div>
        <el-input v-model="title" placeholder="请输入标题" style=" width: 200px;" clearable></el-input>
        <el-select v-model="value" placeholder="请选择所属栏目" clearable filterable style="margin-left: 10px;">
          <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
        </el-select>
        <el-select v-model="organizationId" placeholder="请选择所属机构" clearable filterable style="margin-left: 10px;">
          <el-option v-for="item in ddoptions" :key="item.value" :label="item.label" :value="item.value" />
        </el-select>
        <el-button type="primary" icon="el-icon-search" class="ml10" @click="search">查询</el-button>
      </div>
      <div>
        <!-- <el-button type="primary" icon="el-icon-plus" @click="add">新增文章</el-button> -->
      </div>
    </div>
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="待审核" name="0" />
      <el-tab-pane label="已通过" name="1" />
      <el-tab-pane label="未通过" name="-1" />
    </el-tabs>
    <TableList :loading="loading" :tabledata="tableData" :params="params" :tabledatacolumn="tableDataColumn"
      @chakan="chakan" :isshow="true" @handleCurrentChange="handleCurrentChange" @handleSizeChange="handleSizeChange">
      <template v-slot:default="info">
        <el-button type="text" v-if="activeName == '-1'" @click="ckshjg(info.info)">退回原因</el-button>
        <el-button type="text" v-else-if="activeName == '0' &&  info.info.approvalReason" @click="ckshjg(info.info)">退回原因</el-button>
        <el-button type="text" v-if="activeName == '0'" @click="chakan(info.info)">查看</el-button>
        <!-- <el-button type="text" @click="shenhe(info.info)">审核</el-button> -->
        <el-button type="text" v-if="activeName == '1'" @click="editcontent(info.info)">编辑</el-button>
        <el-button type="text" @click="deleteRow(info.info)">删除</el-button>
        <el-button type="text" v-if="info.info.isTransfer == 1" style="color:red;">审批转移</el-button>
        <!-- <el-button
              icon="el-icon-delete"
              circle
              @click="deleteRow(info.info)"
            ></el-button> -->
      </template>
    </TableList>
    <el-dialog title="审核" :visible.sync="dialogFormVisible" fullscreen @close="quxiao" :close-on-click-modal="false">
      <div class="shenhedetails">
        <!-- <div class="shenhedetails-footer" style="display:flex;justify-content: flex-end;">
          <el-button type="danger" @click="jietu">截图</el-button>
          <el-button type="primary" v-if="details.type == 'article'" @click="yulan">预览</el-button>
        </div> -->
        <el-form :model="details" label-width="100px" label-suffix="：">
          <!--<el-form-item label="标题" style="margin: 0;">
            {{ details.title }}
          </el-form-item>
          <el-form-item v-if="details.url && details.columnId != '39804870715F4427BDB177E39D726B54'" label="封面"
            style="margin: 0;">
            <el-image class="elimg" :src="details.url" />
          </el-form-item>
          <el-form-item v-if="details.url && details.columnId == '39804870715F4427BDB177E39D726B54'" label="封面"
            style="margin: 0;">
            <el-image v-for="item in details.url" class="elimg" :src="item" />
          </el-form-item>
          <el-form-item v-if="details.author" label="作者" style="margin: 0;">
            {{ details.author }}
          </el-form-item>
          <el-form-item v-if="details.postedBy" label="审核人" style="margin: 0;">
            {{ details.postedBy }}
          </el-form-item>
          &lt;!&ndash;<el-form-item v-if="details.no" label="排序" style="margin: 0;">
            {{ details.no }}
          </el-form-item>&ndash;&gt;
          <el-form-item v-if="details.fileUrl && details.columnId == '3EAF2414CC014BDBBF19260DE53332C4'" label="链接"
            style="margin: 0;">
            {{ details.fileUrl }}
          </el-form-item>-->

          <!-- <el-form-item v-if="details.content" label="内容">
            <div v-html="details.content" />
          </el-form-item> -->
          <!-- <iframe :src="'http://59.198.2.188:8080/#/articlecontent?id='+ this.details.id" width="100%" height="500px"></iframe> -->
          <!--  -->
          <div style="margin-bottom: 20px;">
            <span style="margin-left: 18px;font-size: 14px;font-weight: bold;">投稿栏目：</span>
            <span style="margin-left: 14px;">{{ details.columnName}}</span>
          </div>
          <el-form-item v-if="details.fileUrl"
            :label="details.columnId == '1817DA29BBB047B7ADBE6F6D1EC65301' || details.columnId == 'A6DA25D541C140B3AE4341A21A347320' ? '视频' : '附件'">
            <ul v-if="details.fileUrl" class="txllist">
              <li v-for="item in details.fileUrllist" @click="down(item.url)">
                <i class="iconfont icon-Microsoft-Excel" /> <el-link type="primary">{{ item.name }}</el-link>
              </li>
            </ul>
          </el-form-item>
          <!--<el-form-item label="投稿时间">
            {{ details.createTime }}
          </el-form-item>-->
          <!--精彩瞬间 精彩视频筛选 -->
          <div class="newsContent" v-if="details.columnId != '39804870715F4427BDB177E39D726B54' && details.columnId!='A6DA25D541C140B3AE4341A21A347320'">
            <div class="newsContent_title">
              <h2>{{ details.title }}</h2>
            </div>
            <div class="newsContent_info">
              <p style="font-size: 16px!important;padding-bottom: 10px;">
                <span v-if="details.author">
                作者：{{ details.author }}
                </span>
                <span v-if="details.postedBy" style="margin-left: 50px;">
                  审核人：{{ details.postedBy }}
                </span>
              </p>
              <span style="margin-left: 50px;">投稿时间： {{ details.createTime }}</span>
            </div>
            <div class="newsContent_content" v-html="details.content"></div>
          </div>
          <!--精彩瞬间-->
          <div v-else-if="details.columnId == '39804870715F4427BDB177E39D726B54'">
            <div class="newsContent_title">
              <h2>{{ details.title }}</h2>
            </div>
            <div class="newsContent_info" style="text-align: center;font-size: 16px!important;padding-bottom: 10px;">
              <span v-if="details.author">
                作者：{{ details.author }}
                </span>
              <span v-if="details.postedBy"  style="margin-left: 50px;">
                  审核人：{{ details.postedBy }}
                </span>
            </div>
            <div style="text-align: center" v-for="(item,index) in details.url">
              <el-image :src="item" :key="index"></el-image>
            </div>
          </div>
          <!--精彩视频-->
          <div v-else-if="details.columnId == 'A6DA25D541C140B3AE4341A21A347320'">
            <div class="newsContent_title">
              <h2>{{ details.title }}</h2>
            </div>
            <div style="text-align: center">
              <div style="text-align: left;width: 800px;margin: auto;font-size: 16px;padding: 20px 0px;">封面：</div>
              <div>
                <el-image :src="details.url" style="width: 800px;height: 600px;"></el-image>
              </div>
            </div>
            <div class="newsContent_info" style="text-align: center">
              <p style="font-size: 16px!important;padding-bottom: 10px;">
                <span v-if="details.author">
                作者：{{ details.author }}
                </span>
                <span v-if="details.postedBy"  style="margin-left: 50px;">
                  审核人：{{ details.postedBy }}
                </span>
              </p>
            </div>
            <div style="text-align: center" v-for="(item,index) in details.fileUrllist">
              <div style="text-align: left;width: 800px;margin: auto;font-size: 16px;">视频内容：</div>
              <video controls preload="auto" style="width: 800px;height: 600px" :src="item.url">
                <source type="video/mp4">
              </video>
            </div>
          </div>
          <div class="btnline">
            <el-button type="primary" @click="xiugai">修改</el-button>
            <el-button type="success" @click="approveTransfer">审批转移</el-button>
          </div>
        </el-form>


      </div>
      <Form ref="form" :formobj="formobj" :formdata="formData" :formrules="formrules" />
      <div slot="footer" class="dialog-footer">
        <el-button @click="quxiao">取 消</el-button>
        <el-button type="primary" @click="tijiao">确 定</el-button>
      </div>
      <el-dialog title="编辑" :visible.sync="dialogFormInsetVisible" append-to-body width="95%" @close="editquxiao" :close-on-click-modal="false">
        <Form :formobj="editformobj" :formdata="editformData" ref="editform" :formrules="editformrules"></Form>
        <div style="padding-left:100px">
          <el-button type="primary" @click="editsubmit">确 定</el-button>
          <el-button @click="editquxiao">取 消</el-button>
        </div>
      </el-dialog>
    </el-dialog>

    <el-dialog title="编辑" :visible.sync="dialogFormInsetVisible2" append-to-body width="95%" @close="editquxiao" :close-on-click-modal="false">
      <Form :formobj="editformobj" :formdata="editformData" ref="editform" :formrules="editformrules"></Form>
      <div style="padding-left:100px">
        <el-button type="primary" @click="editsubmit('out')">确 定</el-button>
        <el-button @click="editquxiao('out')">取 消</el-button>
      </div>
    </el-dialog>
    <el-dialog title="转移审批" :visible.sync="approvalTransferVisible" append-to-body width="25%" @close="approveTransferSubmitCancel" :close-on-click-modal="false">
      <div style="margin-bottom: 50px;">
        <el-cascader
            style="width: 100%;margin: auto;"
          clearable
          filterable
          v-model="userValue"
          :options="userOptions"
          :props="{ expandTrigger: 'hover' }"
          @change="handleChange"></el-cascader>
      </div>
      <div style="text-align: center;">
        <el-button type="primary" @click="approveTransferSubmit">确 定</el-button>
        <el-button @click="approveTransferSubmitCancel">取 消</el-button>
      </div>
    </el-dialog>
    <!-- <el-dialog title="查看" :visible.sync="dialogck" width="900px">
      <div>
        <h2>{{details.title}}</h2>
        <div v-html="details.content"></div>
        <el-button @click="jietu">截图</el-button>
      </div>
    </el-dialog> -->
    <el-dialog title="退回原因" :visible.sync="dialogckshjg" width="900px">
      <div class="shwzcontent">
        <h2>{{ shdetails.articleTitle }}</h2>

        <div v-html="shdetails.approvalReason" />
      </div>
      <el-tag :type="shdetails.approval == 1 ? 'success' : shdetails.approval == -1 ? 'danger' : ''">{{ shdetails.approval
        ==
        1 ? '已通过' : shdetails.approval == -1 ? '未通过' : '待审核' }}</el-tag>


      <!-- <el-dialog title="" :visible.sync="" >

            <div style="padding-left:100px">
                <el-button type="primary" @click="submit">确 定</el-button>
                <el-button @click="cancel">取 消</el-button>
            </div>
      </el-dialog> -->
    </el-dialog>
  </div>
  <!--<div v-else class="noaudit">
    <h2>该账号没有审核权限！</h2>
  </div>-->
</template>
<script>
import ScreenShort from 'js-web-screen-shot'
import { columnAdd, queryAuthColumn, columndelete, contentApiqueryOne, queryStatistic, queryApprovalPage, contentApidelete, approval, contentApiedit } from '@/api/webpage'
import {queryCascadeUser} from '@/api/organizationApir'
import {queryById} from '@/api/webviews'
import Form from '@/components/form.vue'
import TableList from '@/components/TableListManager.vue'
import { validateNum } from "@/utils/validator";
import { getUserInfo } from '@/utils/auth'
export default {
  name: 'Articlelist',
  components: {
    TableList,
    Form
  },
  data() {
    return {
      userInfo: {},
      userValue: [],
      userOptions: [
        {
          value: 'abcdef1',
          label: '政工',
          children: [{
            value: 'abcdef11',
            label: 'zhenggong'
          }]
        },
        {
          value: 'abcdef2',
          label: '防火',
          children: [{
            value: 'abcdef21',
            label: 'fanghuo'
          }]
        },
      ],
      dialogFormInsetVisible: false,
      activeName: '0',
      loading: true,
      options: [],
      value: '',
      organizationId: '',
      tableData: [],
      dialogckshjg: false,
      shdetails: {},
      tableDataColumn: [
        { label: '标题', key: 'title', type: 'link' },
        { label: '所属栏目', key: 'columnName' },
        { label: '所属机构', key: 'organizationName' },
        { label: '投稿时间', key: 'createTime' },
        { label: '退回时间', key: 'approvalTime' }
      ],
      params: {
        total: 0,
        approval: 0,
        pageNum: 1,
        pageSize: 15,
        columnId: this.$route.query.cid
      },
      formData: {
        contentId: '',
        approvalResult: '',
        approvalReason: '',
        top: '0',
        nice: '0'
      },
      formobj: [
        { label: '审核结果', key: 'approvalResult', type: 'radio', options: [{ label: '通过', value: '1' }, { label: '不通过', value: '-1' }] },
        { label: '是否置顶', key: 'top', type: 'radio', options: [{ label: '是', value: '1' }, { label: '否', value: '0' }] },
        { label: '是否推荐', key: 'nice', type: 'radio', options: [{ label: '是', value: '1' }, { label: '否', value: '0' }] },
        { label: '退回原因', key: 'approvalReason', type: 'editorManager' },
      ],
      formrules: {
        approvalResult: [
          { required: true, message: '请选择', trigger: 'change' }
        ]
      },

      dialogFormVisible: false,
      dialogck: false,
      details: {},
      editformobj: [
      { label: "所属栏目", key: "columnId", type: "select", options: [], },
      ],
      editformData: {},
      editformrules: {},
      ddoptions: [],
      title: '',
      dialogFormInsetVisible2: false,
      approvalTransferVisible: false,
    }
  },
  created() {
    this.userInfo = JSON.parse(getUserInfo())
    console.log("用户信息",this.userInfo)
    this.getoptions()
    this.getlist()

    this.value = this.$route.query.cid
    this.getdata()
    this.getssdd()
    queryCascadeUser({userId: null}).then(resp=>{
      console.log(resp);
      if(resp.code==0){
        this.userOptions = resp.data;
      }
    })
  },
  methods: {
    getssdd() {
      queryStatistic().then(res => {
        if (res.code == 0) {
          this.ddoptions = res.data.map(item => {
            return { label: item.name, value: item.id }
          })
        }
      })
    },
    editquxiao(type) {
      this.editformData = {
        columnId: '',
        ctitle: '',
        title: '',
        no: '',
        content: '',
        url: '',
        fileUrl: '',
        signBy: '',
        createTime: '',
        type: 'article',
      }
      if(type=='out'){
          this.dialogFormInsetVisible2 = false
        }else{
          this.dialogFormInsetVisible = false
        }
    },
    handleChange(value) {
      console.log(value);
    },
    approveTransferSubmitCancel(){ // 审核转移取消
      this.approvalTransferVisible = false
      this.userValue = []
    },
    approveTransferSubmit(){ // 审核转移提交
      if(this.userValue.length == 0){
        return this.$message.error("请选择审批的用户账号");
      }
      console.log("转移给这个账户了",this.userValue)
      console.log("转移给这个账户了",this.details)
      this.details.approvalUser = this.userValue[1];
      this.details.isTransfer = 1; // 审批被转移到其他用户
      contentApiedit(this.details).then((response) => {
        console.log("审批修改",response)
        this.approvalTransferVisible = false
      })
    },
    editsubmit(type) {
      this.$refs.editform.getData().then(res => {
        console.log('%c [ res ]-262', 'font-size:13px; background:pink; color:#bf2c9f;', res)
        if (Array.isArray(res.fileUrl)) {
          let fileurl = []
          let filename = []
          fileurl = res.fileUrl.map(item => {
            if (item.response) {
              if (item.response.data[0].address.includes('\\')) {
                return item.response.data[0].address.replace("\\", '/')
              } else {
                return item.response.data[0].address
              }
            } else {
              return item.url
            }


          })
          filename = res.fileUrl.map(item => {
            return item.name
          })
          res.fileUrl = fileurl.join(",")
          res.fileName = filename.join(",")
        }
        if(Array.isArray(res.url)){
          let urls = []

                    res.url.forEach(item=>{
                        if(item.includes('/show')){
                            urls.push(item.replace('/show',''))
                        }else{
                            urls.push(item)
                        }

                    })
                    res.url = urls.join(",")
        }
        contentApiedit(res).then((response) => {
          if (response.data == 1) {
            this.$message.success("操作成功");
            if(type=='out'){
              this.dialogFormInsetVisible2 = false
            }else{
              this.dialogFormInsetVisible = false
            }
            contentApiqueryOne({ id: this.details.id }).then(res => {
              if (res.code == 0) {
                this.details = res.data
                console.log("修改后的内容是：",this.details)
                if (res.data.url) {
                  if (res.data.columnId == '39804870715F4427BDB177E39D726B54') { //精彩瞬间

                    if (!Array.isArray(this.details.url)) {
                      this.details.url = res.data.url.split(',').map(item => {
                        if (!item.includes('/show')) {
                          return '/show' + item
                        }

                      })
                    }

                  } else {
                    if (!this.details.url.includes('/show')) {
                      this.details.url = '/show' + res.data.url
                    }
                  }
                }
                this.details.fileUrllist = []
                let arrya = []
                let namelist = []
                if (res.data.fileUrl) {
                  arrya = res.data.fileUrl.split(',')
                }
                if (res.data.fileName) {
                  namelist = res.data.fileName.split(',')
                }

                arrya.map((item, index) => {
                  this.details.fileUrllist.push(
                    {
                      name: namelist[index],
                      url: '/show' + item
                    }
                  )
                })
                console.log("修改后的内容arrya是：",arrya)
                console.log("修改后的内容namelist是：",namelist)
                console.log("修改后的内容是：",this.details)
              }
            })

            this.$nextTick(() =>
              this.getlist() //查询一下
            )
          } else {
            this.$message.error("失败");
          }
        })
          .catch((err) => {
          });
      })
    },
    getdata() { // 获得栏目数据
      let data = {
        name: "",
        code: "",
        parentId: "",
      };
      queryAuthColumn(data).then((res) => {
        if (res.code == 0) {
          // 过滤掉审核管理和各地动态
          res.data = res.data.filter(this.filterColumn)
          this.editformobj[0].options = res.data.map(item => {
            this.filterColumnData(item);
            return { label: item.name, value: item.id }
          });
        }
      });
    },
    // dialogFormInsetVisible2
    xiugai2() {
      this.dialogFormInsetVisible2 = true
      this.getdata()
      //精彩视频 视频点播
      if (this.details.columnId == 'A6DA25D541C140B3AE4341A21A347320' || this.details.columnId == '1817DA29BBB047B7ADBE6F6D1EC65301') {
        this.editformobj = [
          { label: "所属栏目", key: "columnId", type: "select", options: [], },
          { label: "标题", key: "title", type: "input" },
          { label: "封面", key: "url", type: "pic" },
          { label: "作者", key: "author", type: "input" },
          { label: "审核人", key: "postedBy", type: "input" },
          { label: "视频", key: "fileUrl", type: "video", word: "请上传mp4文件" },
          { label: "内容", key: "content", type: "editor" },
        ]
        this.editformData = {
          columnId: this.details.columnId,
          title: '',
          fileUrl: '',
          url: '',
          author: ''
        }
        this.editformrules = {
          title: [
            { required: true, message: "请输入标题", trigger: "blur" },
          ],
          url: [
            { required: true, message: "请上传封面", trigger: "blur" },
          ],
          author: [
            { required: true, message: "请输入作者", trigger: "blur" },
          ],
          no: [
            { required: false, message: "请输入序号", trigger: "blur" },
            {
              validator: validateNum,
              message: "请输入正整数",
              trigger: "blur",
            },
          ],
          content: [
            { required: false, message: "请输入正文", trigger: "change" },
          ],
        }
      }
      /*else if (this.details.columnId == 'BD11A0CD7C834F318D8664DB59F2391E') { // 工作简报
        // this.formobj[1]= { label: "附件", key: "fileUrl", type: "execl",word:"请上传文件" }
      }*/
      else if (this.details.columnId == '3B0045D69BEB478E9347BB049B2014E1' || this.details.columnId == 'BD11A0CD7C834F318D8664DB59F2391E'
        || this.details.columnId == '73AC250B8E0A4C92A030D954A49405B5' )
      { //通知通告 工作简报 大事记
        this.editformobj = [
          { label: "所属栏目", key: "columnId", type: "select", options: [], },
          { label: "附件", key: "fileUrl", type: "execl", word: "请上传文件" },
          { label: "标题", key: "title", type: "input" },
          { label: "作者", key: "author", type: "input" },
          { label: "审核人", key: "postedBy", type: "input" },
          /*  { label: "签发人", key: "signBy", type: "input" },*/
          { label: "投稿时间", key: "createTime", type: "date" },
          { label: "内容", key: "content", type: "editor" }
        ]
        this.editformData = {
          columnId: this.details.columnId,
          title: '',
          fileUrl: '',
          url: '',
          author: '',
          postedBy: '',
          createTime: '',
          content: '',
        }
        this.editformrules = {
          title: [
            { required: true, message: "请输入标题", trigger: "blur" },
          ],
          no: [
            { required: false, message: "请输入序号", trigger: "blur" },
            {
              validator: validateNum,
              message: "请输入正整数",
              trigger: "blur",
            },
          ],
          signBy: [
            { required: true, message: "请输入", trigger: "blur" },
          ],
          postedBy: [
            { required: true, message: "请输入", trigger: "blur" },
          ],
        }


      } else if ( // 一线救援 无 调查研究 无
        this.details.columnId == 'D28CDA7DAAB04160BC55CDA3603440F5' ||
        this.details.columnId == '356C9A236C864596AEB827720BDA5507' ||
        this.details.columnId == '0856B89F3A0E4B938FA546E793FC718A' ||
        this.details.columnId == '21DC162B37E34D61954B13AA2C4CCF9D' ||
        this.details.columnId == '1C4023D89C8841C4B58F856C89166B89' ||
        this.details.columnId == '1A0E43D07B694D288FBCC9A89632411D' ||
        // 廉政之窗 政治学习
        this.details.columnId == '53B930B4A1354AD3801E8E4EEEE02381' ||
        this.details.columnId == 'DF8A0370E48045BA8A2CC27258CA4418' ||
        this.details.columnId == '5F14BDA77EB449F385B8CE0478E9C88B' ||
        this.details.columnId == 'ABF991AB428948CBAA8C4103C6A1C954') {
        this.editformobj = [
          { label: "所属栏目", key: "columnId", type: "select", options: [], },
          { label: "标题", key: "title", type: "input" },
          { label: "作者", key: "author", type: "input" },
          { label: "审核人", key: "postedBy", type: "input" },
          { label: "排序", key: "no", type: "input" },
          { label: "内容", key: "content", type: "editor" },
        ]
        this.editformData = {
          columnId: this.details.columnId,
          title: '',
          fileUrl: '',
          url: ''
        }
      } else if (this.details.columnId == '4BF37E6D3E194FD8879F7ED7B4B006BE') {// 机关动态
        this.editformData = {
          columnId: this.details.columnId,
          ctitle: '',
          title: '',
          no: '',
          content: '',
          url: '',
          fileUrl: '',
          signBy: '',
          createTime: '',
          type: 'article',
          articleType: ''
        }
        this.editformobj = [
          { label: "所属栏目", key: "columnId", type: "select", options: [], },
          {
            label: "新闻类型", key: "articleType", type: "select", options: [
              { label: '防火工作', value: '防火工作' },
              { label: '救援工作', value: '救援工作' },
              { label: '政治工作', value: '政治工作' },
              { label: '后勤工作', value: '后勤工作' },
              { label: '纪检工作', value: '纪检工作' },
              { label: '综合工作', value: '综合工作' }
            ]
          },
          /*{ label: "封面", key: "url", type: "pic" },*/
          { label: "标题", key: "title", type: "input" },
          { label: "作者", key: "author", type: "input" },
          { label: "审核人", key: "postedBy", type: "input" },
          { label: "排序", key: "no", type: "input" },
          { label: "投稿时间", key: "createTime", type: "date" },
          { label: "内容", key: "content", type: "editor" },
          { label: "附件", key: "fileUrl", type: "execl", word: "请上传文件" },
        ]
        }else if( this.details.columnId == '39804870715F4427BDB177E39D726B54'){ // 精彩瞬间
        this.editformData = {
          columnId: '',
                ctitle: '',
                title: '',
                no: '',
                author:'',
                content: '',
                url: ''
        }
        this.editformobj = [
        { label: "所属栏目", key: "columnId", type: "select", options: [], },
                { label: "图片", key: "url", type: "piclist" },
                { label: "作者", key: "author", type: "input" },
                { label: "标题", key: "title", type: "input" },
                { label: "排序", key: "no", type: "input" },
                { label: "内容", key: "content", type: "editor" }
        ]
        this.editformrules = {
          title: [
                    { required: true, message: "请输入标题", trigger: "blur" },
                ],
                no: [
                    { required: false, message: "请输入序号", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入正整数",
                        trigger: "blur",
                    },
                ],
                content: [
                    { required: false, message: "请输入正文", trigger: "change" },
                ],
        }
      } else {
        this.editformData = {
          columnId: '',
          ctitle: '',
          title: '',
          no: '',
          content: '',
          url: '',
          fileUrl: '',
          signBy: '',
          createTime: '',
          type: 'article',
        }
        this.editformobj = [
          { label: "所属栏目", key: "columnId", type: "select", options: [], },
          /*{ label: "封面", key: "url", type: "pic" },*/
          { label: "标题", key: "title", type: "input" },
          { label: "作者", key: "author", type: "input" },
          { label: "审核人", key: "postedBy", type: "input" },
          { label: "排序", key: "no", type: "input" },
          { label: "投稿时间", key: "createTime", type: "date" },
          { label: "内容", key: "content", type: "editor" },
          { label: "附件", key: "fileUrl", type: "execl", word: "请上传文件" },
        ]
        this.editformrules = {
          title: [
            { required: true, message: "请输入标题", trigger: "blur" },
          ],
          no: [
            { required: false, message: "请输入序号", trigger: "blur" },
            {
              validator: validateNum,
              message: "请输入正整数",
              trigger: "blur",
            },
          ],
          content: [
            { required: false, message: "请输入正文", trigger: "change" },
          ],
        }
      }
      setTimeout(()=>{
        // let data = JSON.parse(JSON.stringify(this.details))
        let data = this.details
      if(Array.isArray(data.url)){
        data.url = data.url.map(item=>{
          item = item.replace('/show', "")
          return item
        }).join(',')
      }else{
        if(data.url){
          data.url = data.url.replace('/show', "")
        }
      }

      this.editformData = data
      },500)
    },
    approveTransfer(){
      queryById({id:this.details.approvalUser}).then(resp=>{
        this.userValue = []
        // 通过用户查看隶属的机构
        this.userValue[1] = this.details.approvalUser;
        console.log("用户数据是",resp)
        if(resp.code==0 && resp.data){
          this.userValue[0] = resp.data.organizationId;
        }
        console.log("查看后的数据是",this.userValue)
        this.approvalTransferVisible = true
      })
    },
    xiugai() {
      console.log("点击了修改");
      this.dialogFormInsetVisible = true
      this.getdata()
      console.log("栏目名：",this.details.columnName)
      console.log("是否包含政策法规",this.details.columnName.indexOf('政策法规'))
      //精彩视频 视频点播
      if (this.details.columnId == 'A6DA25D541C140B3AE4341A21A347320' || this.details.columnId == '1817DA29BBB047B7ADBE6F6D1EC65301') {
        this.editformobj = [
          { label: "所属栏目", key: "columnId", type: "select", options: [], },
          { label: "标题", key: "title", type: "input" },
          { label: "封面", key: "url", type: "pic" },
          { label: "作者", key: "author", type: "input" },
          { label: "审核人", key: "postedBy", type: "input" },
          { label: "视频", key: "fileUrl", type: "video", word: "请上传mp4文件" },
          { label: "内容", key: "content", type: "editor" },
        ]
        this.editformData = {
          columnId: this.details.columnId,
          title: '',
          fileUrl: '',
          url: ''
        }
      }
      /*else if (this.details.columnId == 'BD11A0CD7C834F318D8664DB59F2391E') { // 工作简报
        // this.formobj[1]= { label: "附件", key: "fileUrl", type: "execl",word:"请上传文件" }
      } */
      // 通知通告和工作简报 大事记
      else if (this.details.columnId == '3B0045D69BEB478E9347BB049B2014E1' || this.details.columnId == 'BD11A0CD7C834F318D8664DB59F2391E'
        || this.details.columnId == '73AC250B8E0A4C92A030D954A49405B5'
      ) {
        this.editformobj = [
          { label: "所属栏目", key: "columnId", type: "select", options: [], },
          { label: "附件", key: "fileUrl", type: "execl", word: "请上传文件" },
          { label: "标题", key: "title", type: "input" },
          { label: "作者", key: "author", type: "input" },
          { label: "审核人", key: "postedBy", type: "input" },
          /*  { label: "签发人", key: "signBy", type: "input" },*/
          { label: "投稿时间", key: "createTime", type: "date" },
          { label: "内容", key: "content", type: "editor" }
        ]
        this.editformData = {
          columnId: this.details.columnId,
          title: '',
          fileUrl: '',
          url: '',
          author: '',
          postedBy: '',
          createTime: '',
          content: '',
        }
        this.editformrules = {
          title: [
            { required: true, message: "请输入标题", trigger: "blur" },
          ],
          no: [
            { required: false, message: "请输入序号", trigger: "blur" },
            {
              validator: validateNum,
              message: "请输入正整数",
              trigger: "blur",
            },
          ],
          signBy: [
            { required: true, message: "请输入", trigger: "blur" },
          ],
          postedBy: [
            { required: true, message: "请输入", trigger: "blur" },
          ],
        }


      } else if (
        this.details.columnId == 'D28CDA7DAAB04160BC55CDA3603440F5' ||
        this.details.columnId == '356C9A236C864596AEB827720BDA5507' ||
        this.details.columnId == '0856B89F3A0E4B938FA546E793FC718A' ||
        this.details.columnId == '21DC162B37E34D61954B13AA2C4CCF9D' || this.details.columnId == '1C4023D89C8841C4B58F856C89166B89' || this.details.columnId == '1A0E43D07B694D288FBCC9A89632411D' || this.details.columnId == '53B930B4A1354AD3801E8E4EEEE02381' || this.details.columnId == 'DF8A0370E48045BA8A2CC27258CA4418' || this.details.columnId == '5F14BDA77EB449F385B8CE0478E9C88B' || this.details.columnId == 'ABF991AB428948CBAA8C4103C6A1C954') {
        this.editformobj = [
          { label: "所属栏目", key: "columnId", type: "select", options: [], },
          { label: "标题", key: "title", type: "input" },
          { label: "作者", key: "author", type: "input" },
          { label: "审核人", key: "postedBy", type: "input" },
          { label: "排序", key: "no", type: "input" },
          { label: "内容", key: "content", type: "editor" },
        ]
        this.editformData = {
          columnId: this.details.columnId,
          title: '',
          fileUrl: '',
          url: ''
        }
      } else if (this.details.columnId == '4BF37E6D3E194FD8879F7ED7B4B006BE') {//机关动态
        this.editformData = {
          columnId: this.details.columnId,
          ctitle: '',
          title: '',
          no: '',
          content: '',
          url: '',
          fileUrl: '',
          signBy: '',
          createTime: '',
          type: 'article',
          articleType: ''
        }
        this.editformobj = [
          { label: "所属栏目", key: "columnId", type: "select", options: [], },
          {
            label: "新闻类型", key: "articleType", type: "select", options: [
              { label: '防火工作', value: '防火工作' },
              { label: '救援工作', value: '救援工作' },
              { label: '政治工作', value: '政治工作' },
              { label: '后勤工作', value: '后勤工作' },
              { label: '纪检工作', value: '纪检工作' },
              { label: '综合工作', value: '综合工作' }
            ]
          },
          /*{ label: "封面", key: "url", type: "pic" },*/
          { label: "标题", key: "title", type: "input" },
          { label: "作者", key: "author", type: "input" },
          { label: "审核人", key: "postedBy", type: "input" },
          { label: "排序", key: "no", type: "input" },
          { label: "投稿时间", key: "createTime", type: "date" },
          { label: "内容", key: "content", type: "editor" },
          { label: "附件", key: "fileUrl", type: "execl", word: "请上传文件" },
        ]
      } else if( this.details.columnId == '39804870715F4427BDB177E39D726B54'){
        this.editformData = {
          columnId: '',
                ctitle: '',
                title: '',
                no: '',
                author:'',
                content: '',
                url: ''
        }
        this.editformobj = [
        { label: "所属栏目", key: "columnId", type: "select", options: [], },
                { label: "图片", key: "url", type: "piclist" },
                { label: "作者", key: "author", type: "input" },
                { label: "标题", key: "title", type: "input" },
                { label: "排序", key: "no", type: "input" },
                { label: "内容", key: "content", type: "editor" }
        ]
        this.editformrules = {
          title: [
                    { required: true, message: "请输入标题", trigger: "blur" },
                ],
                no: [
                    { required: false, message: "请输入序号", trigger: "blur" },
                    {
                        validator: validateNum,
                        message: "请输入正整数",
                        trigger: "blur",
                    },
                ],
                content: [
                    { required: false, message: "请输入正文", trigger: "change" },
                ],
        }
      }else if(this.details.columnName && this.details.columnName.indexOf("政策法规") != -1){
        console.log("政策法规栏目修改");
        this.editformData = {
          columnId:'',
          title:'',
          fileUrl:'',
          author:'',
          content:'',
          type:'article'
        }
        this.editformobj = [
          { label: "所属栏目", key: "columnId", type: "select",options:[], disabled:false },
          // { label: "图片", key: "url", type: "pic" },
          { label: "标题", key: "title", type: "input" },
          { label: "作者", key: "author", type: "input" },
          { label: "审核人", key: "postedBy", type: "input" },
          { label: "附件", key: "fileUrl", type: "execl",word:'请上传文件' },
        ]
        this.editformrules = {
          title: [
            { required: true, message: "请输入标题", trigger: "blur" },
          ],
          columnId: [
            { required: true, message: "请选择栏目", trigger: "blur" },
          ],
          author: [
            { required: true, message: "请输入作者", trigger: "blur" },
          ],
          postedBy: [
            { required: true, message: "请输入审核人", trigger: "blur" },
          ],
        }

      }else{
        this.editformData = {
          columnId: '',
          ctitle: '',
          title: '',
          no: '',
          content: '',
          url: '',
          fileUrl: '',
          signBy: '',
          createTime: '',
          type: 'article',
        }
        this.editformobj = [
          { label: "所属栏目", key: "columnId", type: "select", options: [], },
         /* { label: "封面", key: "url", type: "pic" },*/
          { label: "标题", key: "title", type: "input" },
          { label: "作者", key: "author", type: "input" },
          { label: "审核人", key: "postedBy", type: "input" },
          { label: "排序", key: "no", type: "input" },
          { label: "投稿时间", key: "createTime", type: "date" },
          { label: "内容", key: "content", type: "editor" },
          { label: "附件", key: "fileUrl", type: "execl", word: "请上传文件" },
        ]
        this.editformrules = {
          title: [
            { required: true, message: "请输入标题", trigger: "blur" },
          ],
          no: [
            { required: false, message: "请输入序号", trigger: "blur" },
            {
              validator: validateNum,
              message: "请输入正整数",
              trigger: "blur",
            },
          ],
          content: [
            { required: false, message: "请输入正文", trigger: "change" },
          ],
        }
      }
      setTimeout(()=>{
        let data = JSON.parse(JSON.stringify(this.details))
      if(Array.isArray(data.url)){
        data.url = data.url.map(item=>{
          item = item.replace('/show', "")
          return item
        }).join(',')
      }else{
        if(data.url){
          data.url = data.url.replace('/show', "")
        }

      }

      this.editformData = data
      },500)
    },
    yulan() {

      window.open('http://127.0.0.1:8080/#/articlecontent?id=' + this.details.id)
    },
    handleClick(tab, event) {
      this.params.approval = tab.name
      // 验证一下显示列
      if(this.params.approval == 1){ // 已通过
        this.tableDataColumn = [
          { label: '标题', key: 'title', type: 'link' },
          { label: '所属栏目', key: 'columnName' },
          { label: '所属机构', key: 'organizationName' },
          { label: '投稿时间', key: 'createTime' },
          { label: '审核时间', key: 'approvalTime' }
        ]
      }else if(this.params.approval == 0){ // 待审核
        this.tableDataColumn = [
          { label: '标题', key: 'title', type: 'link' },
          { label: '所属栏目', key: 'columnName' },
          { label: '所属机构', key: 'organizationName' },
          { label: '投稿时间', key: 'createTime' },
          { label: '退回时间', key: 'approvalTime' }
        ]
      }else if(this.params.approval == -1){ // 未通过
        this.tableDataColumn = [
          { label: '标题', key: 'title', type: 'link' },
          { label: '所属栏目', key: 'columnName' },
          { label: '所属机构', key: 'organizationName' },
          { label: '投稿时间', key: 'createTime' },
          { label: '退回时间', key: 'approvalTime' }

        ]
      }

      this.params.pageNum = 1
      this.getlist()
    },
    down(item) {
      window.open(this.requestUrl + item)
    },
    ckshjg(row) {
      this.dialogckshjg = true
      this.shdetails = row
    },
    jietu() {
      const screenShotHandler = new ScreenShort({
        enableWebRtc: false, // 是否显示选项框
        level: 9999, // 层级级别
        completeCallback: this.callback,
        closeCallback: this.closeFn
      })
    },
    // 查看
    chakan(row) {
      this.details = row
      console.log("详细内容信息",this.details)
      if (row.url) {
        if (row.columnId == '39804870715F4427BDB177E39D726B54') { // 精彩瞬间
          if (!Array.isArray(this.details.url)) {
            this.details.url = row.url.split(',').map(item => {
              if (!item.includes('/show')) {
                return '/show' + item
              }

            })
          }


        } else {
          if (!this.details.url.includes('/show')) {
            this.details.url = '/show' + row.url
          }

        }
      }
      this.details.fileUrllist = []
      let arrya = []
      let namelist = []
      if (row.fileUrl) {
        arrya = row.fileUrl.split(',')
      }
      if (row.fileName) {
        namelist = row.fileName.split(',')
      }

      arrya.map((item, index) => {
        this.details.fileUrllist.push(
          {
            name: namelist[index],
            url: '/show' + item
          }
        )
      })
      this.dialogFormVisible = true
      this.formData.contentId = row.id
    },
    editcontent(info) {
      this.details = info
      this.xiugai2()
    },
    // 审核
    shenhe(info) {
      this.dialogFormVisible = true
      this.formData.contentId = info.id
    },
    // 提交审核
    tijiao() {
      this.$refs.form.getData().then(res => {
        approval(res).then(result => {
          if (result.code == 0) {
            this.dialogFormVisible = false
            this.$refs.form.resetForm()
            this.$message.success('审核成功')
            this.getlist()
          }
        })
      })
    },
    quxiao() {
      this.dialogFormVisible = false
      this.$refs.form.resetForm()
    },
    search() {
      this.params.columnId = this.value
      this.params.organization = this.organizationId
      this.params.title = this.title
      this.getlist()
    },
    add() {
      this.$router.push({
        name: 'addform'
      })
    },
    filterColumn(item){
      if(item.name === '审核管理'  || item.name === '各地动态' || item.name==='下载中心'
        || item.name==='友情链接' || item.name==='国家消防救援局' || item.name==='吉林省消防救援总队' || item.name==='省内消防系统'
        || item.name==='政策法规'
      ){
        return false;
      }
      return  true;
    },
    filterColumnData(item){
      // 处理各地动态二级栏目
      if(
        item.id == '437C9EAB57FB4C558A33EC96445F7487' ||
        item.id == '21BCBF2C36DF4175A22296F3EE3D069F' ||
        item.id == '6AEBF34D0F9D44D6A769A75D9CBB0F50' ||
        item.id == '94D8ADCCF64640E9B986A38380B9DAA9' ||
        item.id == '52BB3EDFD6FA47A891191F2B43FE643D' ||
        item.id == '45F7E806AF264307BC0F823EB1657919'
      ){
        item.name = "各地动态—"+item.name;
      }
      //处理下载中心二级栏目
      if(
        item.name == '办公软件' ||
        item.name == '安全杀毒' ||
        item.name == '视频插件' ||
        item.name == '常用字体' ||
        item.name == '消防站训练计划'
      ){
        item.name = '下载中心—'+item.name;
      }
      // 处理正常法规
      if(item.name === '法规一' || item.name === '法规二'){
        item.name = '政策法规—'+item.name;
      }
    },
    getoptions() { // 查询具有权限的栏目
      const data = {
        name: '',
        code: '',
        parentId: ''
      }
      queryAuthColumn(data).then((res) => {
        if (res.code == 0) {
          // 过滤掉审核管理和各地动态
          res.data = res.data.filter(this.filterColumn)
          this.options = res.data.map(item => {
            this.filterColumnData(item);
            return { label: item.name, value: item.id }
          })
        }
      })
    },
    getlist() {
      this.loading = true
      queryApprovalPage(this.params).then((res) => {
        if (res.code == 0) {
          this.loading = false
          this.tableData = res.rows
          console.log("数据是：",res.rows)
          this.tableData = this.tableData.map(item=>{
            if(! item.organizationName){
              item.organizationName = "机关-管理员";
            }else if(item.organizationName.length<4){
              item.organizationName = "机关-"+item.organizationName;
            }
            // 验证是否是机关动态
            if(item.articleType){
              item.columnName = item.columnName+"-"+item.articleType
            }
            // 是否是各地动态
            if(
              item.columnId == '437C9EAB57FB4C558A33EC96445F7487' ||
              item.columnId == '21BCBF2C36DF4175A22296F3EE3D069F' ||
              item.columnId == '6AEBF34D0F9D44D6A769A75D9CBB0F50' ||
              item.columnId == '94D8ADCCF64640E9B986A38380B9DAA9' ||
              item.columnId == '52BB3EDFD6FA47A891191F2B43FE643D' ||
              item.columnId == '45F7E806AF264307BC0F823EB1657919'
            ){
              item.columnName = "各地动态—"+item.columnName;
            }
            return item;
          })

          this.params.total = res.total
        }
      })
    },
    handleCurrentChange(val) {
      this.params.pageNum = val
      this.getlist()
    },
    handleSizeChange(val) {
      this.params.pageSize = val
      this.getlist()
    },
    deleteRow(row) {
      this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          const ids = []
          ids.push(row.id)
          contentApidelete(ids)
            .then((res) => {
              if (res.data == 1) {
                this.$message({
                  type: 'success',
                  message: '删除成功!'
                })
                this.getlist()
              } else {
                this.$message.error('删除失败')
              }
            })
            .catch((err) => {
            })
        })
        .catch(() => { })
    }
  },
  /**
     * 根据图片生成画布
     */
  convertImageToCanvas(image) {
    var canvas = document.createElement('canvas')
    canvas.width = image.width
    canvas.height = image.height
    canvas.getContext('2d').drawImage(image, 0, 0)
    return canvas
  },
  /**
     * 生成图片
     * 截图确认按钮回调函数
     */
  callback(base64data) {
    var image = new Image()
    image.src = base64data
    image.onload = () => {
      var canvas = this.convertImageToCanvas(image)
      var url = canvas.toDataURL('image/jpeg')
      // 在页面展示的数组，次数组是要把截图成功后的图片在页面上展示出来的数组，可以根据自己项目的需求进行添加
      this.uploadlist.push({ image: url })
      for (var i = 0; i < this.uploadlist.length; i++) {
        if (this.uploadlist.length >= 6) {
          this.uploadhide = false
        }
      }

      var bytes = window.atob(url.split(',')[1]) // 通过atob将base64进行编码
      // 处理异常，将ASCII码小于0的转换为大于0,进行二进制转换
      var buffer = new ArrayBuffer(bytes.length)
      var uint = new Uint8Array(buffer) // 生成一个8位数的数组
      for (var i = 0; i < bytes.length; i++) {
        uint[i] = bytes.charCodeAt(i) // 根据长度返回相对应的Unicode 编码
      }
      // Blob对象
      var imageFile = new Blob([buffer], { type: 'image/jpeg' }) // type为图片的格式

      // 给后台返回的数组，我的项目需求是要截图多张上传给后端的，如果只上传一张直接就上传imageFile上一句就行，这个数组可以跟根据自己的需求进行编写
      this.imageFilelist.push(imageFile)
      if (this.imageFilelist != '') {
        this.$message({
          type: 'success',
          message: '截图成功'
        })
      }
    }
  }
}
</script>
<style scoped>
@import "~@/assets/css/adminstyle.css";
</style>
<style>
/*.elimg .el-image__inner--center {
  -ms-transform: translate(-50%, 0%)
}*/
.noaudit h2{
  font-size: 35px;
  text-indent: 2em;
  padding: 50px 0;
}
.shenhedetails {
  padding-bottom: 20px;
  border-bottom: 1px rgba(0, 0, 0, 0.2) dotted;
  margin-bottom: 20px;
}

.shenhedetails h2 {
  font-size: 24px;
  line-height: 1.5;
  color: #000;
}

.shwzcontent h2 {
  font-size: 18px;
  line-height: 1.5;
}

.txllist {
  padding: 0;
  margin: 0;

}

.txllist li {
  list-style: none;
}

.shenhedetails-footer {
  position: fixed;
  right: 50px;
  top: 100px;
  z-index: 999;
}

.newsContent {
  width: 90%;
  margin: 0 auto;
  border: 1px #dadada solid;
  box-sizing: border-box;
  padding: 20px 30px;

}

.newsContent_title h2 {
  font-size: 18px;
  color: #333;
  text-align: center;
  font-weight: bold;
}

.newsContent_title {
  padding-top: 30px;
  padding-bottom: 20px;
}

.newsContent_info {
  display: flex;
  justify-content: center;
}

.btnline {
  padding-top: 20px;
  text-align: center;
}

.dialog-footer {
  display: flex;
  justify-content: center;
}
</style>
